<template>
 <el-card class="navSearch">
    <el-row type="flex" justify="end" align="footer">
      <!-- 前插槽-查询表单 -->
      <el-col>
            <el-form ref="form" :inline="''" :model="form"  class="demo-form-inline">
              <el-form-item v-if="formList.store" prop="store"  label="所属店铺：" >
                <el-input v-model="form.store" placeholder="店铺名称"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.goods" prop="goods" label="商品：" >
                <el-input v-model="form.goods" placeholder="搜索商品编号/商品名称"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.goodsTypeS"  prop="goodsType"  label="商品类别：" >
                <el-select  placeholder="请选择" v-model="form.goodsType">
                  <el-option v-for="item in dataList" :key="item.id" :label="item.goodsClass" :value="item.goodsClass"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item v-if="formList.firmNameI" prop="firmName" label="行业名称：">
                <el-input></el-input>
              </el-form-item>
              <el-form-item v-if="formList.firmNameS"  label="行业名称：" >
               <el-select  placeholder="请选择" v-model="form.firmName" style="margin-right:5px">
                  <el-option label="区域一" value="12"></el-option>
                  <el-option label="区域二" value="12"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item v-if="formList.goodsTypeI" prop="goodsTypeI" label="商品类别：" >
                <el-input placeholder="类别名称" v-model="form.goodsTypeI"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.discount" prop="discount" label="优惠券：">
                <el-input placeholder="优惠券名称"  v-model="form.discount"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.user"  prop="user" label="用户ID/昵称：">
                <el-input v-model="form.user"></el-input>
              </el-form-item>
             <el-form-item v-if="formList.materialName" prop="materialName" label="素材名称：">
                <el-input placeholder="输入要搜索的素材名称"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.materialType" prop="materialType" label="素材类别：">
                <!-- <el-select  placeholder="请选择" style="margin-right:5px">
                  <el-option label="区域一" value="1">1</el-option>
                  <el-option label="区域二" value="1">1</el-option>
                </el-select>
                <el-select  placeholder="请选择">
                  <el-option label="区域一" value="1">1</el-option>
                  <el-option label="区域二" value="1">1</el-option>
                </el-select> -->
              </el-form-item>
              <el-form-item v-if="formList.earnings" prop="earnings" label="推广收益:">
                <!-- <el-select  placeholder="请选择" style="margin-right:5px">
                  <el-option label="区域一" value="1">1</el-option>
                  <el-option label="区域二" value="1">1</el-option>
                </el-select>
                <el-select  placeholder="请选择">
                  <el-option label="区域一" value="1">1</el-option>
                  <el-option label="区域二" value="1">1</el-option>
                </el-select> -->
              </el-form-item>
              <el-form-item v-if="formList.uploaderId" prop="uploaderId" label="上传者ID：">
                <el-input></el-input>
              </el-form-item>
             <el-form-item v-if="formList.status" prop="status" label="状态：" >
                <!-- <el-select  placeholder="请选择" >
                  <el-option label="区域一" value=""></el-option>
                  <el-option label="区域二" value=""></el-option>
                </el-select> -->
              </el-form-item>
              <el-form-item v-if="formList.order" prop="order" label="提现单号：">
                <el-input v-model="form.order"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.tradeType" prop="tradeType" label="交易类型：">
                <el-input v-model="form.tradeType"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.orderNum" prop="orderNum" label="订单号：">
                <el-input v-model="form.orderNum"></el-input>
              </el-form-item>
              <el-form-item v-if="formList.account" prop="account" label="账号：">
                <el-input></el-input>
              </el-form-item>
              <el-form-item v-if="formList.name" prop="name" label="姓名：">
                <el-input></el-input>
              </el-form-item>
              <el-form-item v-if="formList.phone" prop="phone" label="手机号：">
                <el-input></el-input>
              </el-form-item>

            </el-form>

      </el-col>
      <el-col style="width:100px;">
        <!-- 后插槽-公共按钮 -->
        <el-row type="flex" justify="end">
          <!-- <slot name="after" /> -->
          <el-button size="small" type="primary" @click="btnSearch">查询</el-button>
        <el-button size="small" type="info" @click="btnReset">重置</el-button>
        </el-row>
      </el-col>
    </el-row>
  </el-card>
</template>
<script>
export default {
  data () {
    return {
      form: {
        goodsTypeI:'',
        store: '',
        discount: '',
        user: '',
        order: '',
        date: '',
        status: '',
        tradeType: '',
        orderNum: '',
        firmName: '',
        materialName: '',
        materialType: '',
        uploaderId: '',
        goods: '',
        goodsType: '',
        account: '',
        name: '',
        phone: ''
      }
    }
  },
  props: {
    formList: {
      type: Object
    },
    dataList: {
      type: Object
    }
  },
  created () {
    // console.log(this.tableData[1].activity)
  },
  methods: {
    btnSearch () {
      this.$emit('btnSearch', this.form)
    },
    btnReset () {
      // this.$refs.roleForm.resetFields()
      this.$refs.form.resetFields()
      // this.$refs[form].resetFields()
    }
  }
}
</script>

 <style>
 .navSearch {
    margin: 10px 0;
 }
</style>
